/**
 * 减肥大师小程序共享组件
 * 包含状态栏、底部导航等共享UI元素
 */

// 当前时间更新函数
function updateTime() {
    const timeElement = document.querySelector('.status-bar-time');
    if (timeElement) {
        const now = new Date();
        const hours = now.getHours().toString().padStart(2, '0');
        const minutes = now.getMinutes().toString().padStart(2, '0');
        timeElement.textContent = `${hours}:${minutes}`;
    }
}

// 初始化页面基本结构
function initPageStructure(title, activeTab) {
    // 获取当前时间
    const now = new Date();
    const hours = now.getHours().toString().padStart(2, '0');
    const minutes = now.getMinutes().toString().padStart(2, '0');
    
    // 创建状态栏
    const statusBar = `
        <div class="status-bar">
            <div class="status-bar-time">${hours}:${minutes}</div>
            <div class="status-bar-icons">
                <i class="fas fa-signal"></i>
                <i class="fas fa-wifi"></i>
                <i class="fas fa-battery-three-quarters"></i>
            </div>
        </div>
    `;
    
    // 创建导航栏
    const navBar = `
        <div class="nav-bar">
            <div class="nav-title">${title}</div>
            <button class="nav-btn"><i class="fas fa-ellipsis-h"></i></button>
        </div>
    `;
    
    // 创建底部标签栏
    const tabBar = `
        <div class="tab-bar">
            <div class="tab-item ${activeTab === 'home' ? 'active' : ''}" onclick="location.href='home.html'">
                <i class="tab-icon fas fa-home"></i>
                <span>首页</span>
            </div>
            <div class="tab-item ${activeTab === 'food' ? 'active' : ''}" onclick="location.href='food-recognition.html'">
                <i class="tab-icon fas fa-camera"></i>
                <span>识别</span>
            </div>
            <div class="tab-item ${activeTab === 'diet' ? 'active' : ''}" onclick="location.href='diet-plan.html'">
                <i class="tab-icon fas fa-utensils"></i>
                <span>饮食</span>
            </div>
            <div class="tab-item ${activeTab === 'exercise' ? 'active' : ''}" onclick="location.href='exercise-plan.html'">
                <i class="tab-icon fas fa-dumbbell"></i>
                <span>运动</span>
            </div>
            <div class="tab-item ${activeTab === 'profile' ? 'active' : ''}" onclick="location.href='profile.html'">
                <i class="tab-icon fas fa-user"></i>
                <span>我的</span>
            </div>
        </div>
    `;
    
    // 返回完整页面结构
    return `
        <div class="phone-container">
            ${statusBar}
            ${navBar}
            <div class="content-container" id="content">
                <!-- 内容将在这里动态插入 -->
            </div>
            ${tabBar}
        </div>
    `;
}

// 页面加载后初始化
document.addEventListener('DOMContentLoaded', function() {
    // 每分钟更新一次时间
    updateTime();
    setInterval(updateTime, 60000);
}); 